import { PureComponent } from 'react';
import { connect } from 'react-redux';

class Topic extends PureComponent {
    render() {
        let { list } = this.props;
        return (
            <div className="topic">
                {list.map(item => {
                    return (
                        <div className="item" key={item.id}>
                            <img src={item.imgUrl} alt={item.title} />
                            {item.title}
                        </div>
                    );
                })}
            </div>
        );
    }
}

const mapStateToProps = state => {
    return {
        list: state.getIn(['home', 'topicList']),
    };
};

export default connect(mapStateToProps, null)(Topic);
